<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/login.css">
    <link rel="stylesheet" href="./css/component.css">
</head>

<body>
    <section>
        <aside class="login__logo"></aside>
        <article class="login__main">
            <form action="views/main.html" method="get">
                <fieldset>
                    <legend hidden>用户登录</legend>
                    <label class="label__info" for="userName">用户名：</label>
                    <input type="text" name="userName" id="userName" class="normal-input input-width" placeholder="请输入用户名" title="我是一个文本框"><br>
                    <label class="label__info" for="password">密&nbsp;&nbsp;&nbsp;码：</label>
                    <input type="password" name="password" id="password" class="normal-input input-width" placeholder="请输入密码"><br>
                    <nav id="cookieGroup">
                        <input type="checkbox" name="isCookie" id="isCookie">
                        <label for="isCookie" class="label__info">一周之内免登录</label>
                    </nav>
                    <nav id="showCookie"></nav>
                    <nav class="main__buttonGroup">
                        <button type="submit" class="login-button">登录</button>
                        <button type="submit" class="login-button" id="btnRegister" formaction="register.html">注册</button>
                    </nav>
                </fieldset>
            </form>
        </article>
    </section>
</body>
<script>
    function selectCookie() {
        let o = document.getElementById("cookieGroup");
        let nav = document.getElementById("showCookie");
        o.toggleAttribute("hidden");
        nav.classList.toggle("change");
    }
    document.getElementById("showCookie").addEventListener("click", selectCookie, false);
</script>
</html>